@promobarFontColor: #168fd6;
@promobarBgColor: #FFFCEB;
@promobarBorderColor: #F5F5E9;

.hermes-promobar {
  box-sizing: border-box;
  height: 18px;
  line-height: 18px;
  padding: 0px 12px;
  background: @promobarBgColor;

  .hermes-promobar-container {
    height: 100%;
    position: relative;
    overflow: hidden;
  }
  .hermes-promobar-close {
    float: right;
    margin-left: 15px;
  }
  .hermes-promobar-list {
    position: absolute;
    top: 0;
    left: 0;
  }
  .hermes-promobar-item {
    margin: 0px 20px;
    font-size: 12px;
    white-space: nowrap;
    display: inline-flex;
    color: @promobarFontColor;
    .jsx-content {
      display: inline-flex;
      > div> a> {
        color: red;
        text-decoration: underline
      }
    }
  }

  .hermes-promobar-has-link:hover {
    text-decoration: underline !important;
  }
  .hermes-promobar-list-v {
    transition: transform 1s ease-in-out;

    .hermes-promobar-item-wrap {
      overflow: hidden;
      text-overflow: ellipsis;
      color: @promobarFontColor;
    }
    .hermes-promobar-item {
      margin: 0px;
    }
  }
}